<div data-page="setting_backImage" class="page no-toolbar navbar-fixed" id="setting_backImage">
	<div class="navbar" style="background-color:white;">
			<!-- Navbar page 1 -->
			<div class="navbar-inner">
				<div class="left">
					<a href="#" class="link back">
						<i class="icon icon-angle-left" style="color:#15191c;"></i> 
						<span style="color:#15191c;">返回</span>
					</a>
				</div>
				<div class="center"><span style="font-weight: 600;color:#15191c;">聊天背景</span></div>
				<div class="right"></div>
			</div>
		</div>

	<div class="page-content" style="overflow-x: hidden;">
		<style>
			.ul_image {
				position: relative;
				margin: 0px;
				width: 100%;
				padding: 0;
				list-style: none;
				text-align: center;
				text-transform: uppercase;
				font-weight: 900;
				font-size: 20px;
				line-height: 40px;
				color: #555;
			}
			
			img {
				position: absolute;
				margin: 0px;
				top: 0;
				left: 0;
				bottom: 0;
				right: 0;
				width: 100%;
				height: 100%;
				border-radius: 1px;
				box-shadow: 0 0 0 4px #fff;
				cursor: pointer;
				animation: unselected 0.3s cubic-bezier(0.250, 0.100, 0.250, 1.000);
				-o-animation: unselected 0.3s cubic-bezier(0.250, 0.100, 0.250, 1.000);
				-ms-animation: unselected 0.3s cubic-bezier(0.250, 0.100, 0.250, 1.000);
				-moz-animation: unselected 0.3s cubic-bezier(0.250, 0.100, 0.250, 1.000);
				-webkit-animation: unselected 0.3s cubic-bezier(0.250, 0.100, 0.250, 1.000);
			}
			
			.li_image {
				position: relative;
				margin: 10px;
				width: 29%;
				height: 157px;
				float: left;
			}
			
			.li_image:before {
				content: "\2714";
				display: block;
				position: absolute;
				margin: 0px;
				top: 35%;
				left: 35%;
				width: 40px;
				height: 40px;
				line-height: 40px;
				color: #1090FD;
				text-align: center;
				font-size: 26px;
				z-index: 10;
				opacity: 0;
				transition: 0.3s linear;
				-o-transition: 0.3s linear;
				-ms-transition: 0.3s linear;
				-moz-transition: 0.3s linear;
				-webkit-transition: 0.3s linear;
				-o-user-select: none;
				-moz-user-select: none;
				-webkit-user-select: none;
				cursor: pointer;
			}
			
			.li_image.selected:before {
				opacity: 1;
			}
			/* img selection */
			
			.li_image.selected img {
				box-shadow: 0 0 0 4px #00c09e;
				animation: selected 0.3s cubic-bezier(0.250, 0.100, 0.250, 1.000);
				-o-animation: selected 0.3s cubic-bezier(0.250, 0.100, 0.250, 1.000);
				-ms-animation: selected 0.3s cubic-bezier(0.250, 0.100, 0.250, 1.000);
				-moz-animation: selected 0.3s cubic-bezier(0.250, 0.100, 0.250, 1.000);
				-webkit-animation: selected 0.3s cubic-bezier(0.250, 0.100, 0.250, 1.000);
			}
		</style>
		<div style="width: 100%;height: 100%;" align="center">
			<ul class="ul_image">
				<li class="li_image"><img src="image/background/ic_backgroud_1.jpg" /></li>
				<li class="li_image"><img src="image/background/ic_backgroud_2.jpg" /></li>
				<li class="li_image"><img src="image/background/ic_backgroud_3.jpg" /></li>
				<li class="li_image"><img src="image/background/ic_backgroud_4.jpg" /></li>
				<li class="li_image"><img src="image/background/ic_backgroud_5.jpg" /></li>
				<li class="li_image"><img src="image/background/ic_backgroud_6.jpg" /></li>
			</ul>
		</div>

	</div>
</div>